<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>短信项目添加</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link href="../../layui/css/layui.css" rel="stylesheet" type="text/css">
<link href="../../css/style.css" rel="stylesheet" type="text/css">
<script src="../../layui/layui.js"></script>
<script src="../../js/util.js"></script>
<script>
        layui.use(['layer', 'form', 'jquery'], function () {
            var layer = layui.layer;
            var form = layui.form;
            var $ = layui.$;
            var url = '/busi/add';
            $('#insert').on('click', function () {
                var name = $("#name").val();
                var cityId=$("#cityId").val();
                var extId=$("#extId").val();
                var param = {
                    name: name,
                    cityId: cityId,
                    extId: extId
                };
                $.ajax({
                    type: 'post',
                    data: param,
                    url: url,
                    beforeSend: function () {
                        if (isNull(name)) {
                            layer.msg("项目名称不能为空");
                            return false;
                        }
                        if(isNull(cityId)){
                            layer.msg("必须选择一个城市");
                            return false;
                        }
                         if(isNull(extId)){
                            layer.msg("必须选择一个扩展码");
                            return false;
                        }
                    },
                    success: function (json) {
                        var index=parent.layer.getFrameIndex(window.name);
                        if (json.code == 0) {
                            layer.msg('添加成功');
                            parent.layer.close(index);
                        }else {
                            layer.msg(json.msg);
                            parent.layer.close(index);
                        }
                       
                       
                    },
                    complete: function () {

                    },
                    error: function (data) {

                    }
                });
            });
            
            //监听项目
            form.on('select(cityId)', function (data) {
                var data = selectExtInfo(data.value);
                
                appendExtId(data);
            });
            //根据城市ID查询扩展码
            function selectExtInfo(cityId) {
                var data;
                var url = '/util/findExdId?cityId=' + cityId;
                $.ajax({
                        type: 'post',
                        async: false,
                        url: url,
                        success: function (json) {
                            console.log(json.data);
                            data = json.data;
                        }, error: function () {
                            layer.msg('系统异常，请联系管理员处理!');
                        }
                    }
                );
                return data;
            }
            //动态拼接扩展码
            function appendExtId(data) {
                if (data.length != null) {
                    var options = '<option value="">请选择</option>';
                    for (var i = 0; i < data.length; i++) {
                        options += '<option value="' + data[i] + '">' + data[i] + '</option>';
                    }
                    $('#extId').html(options);
                } else {
                    $('#extId').html('<option value="">该地市下没有扩展码</option>');
                }
                form.render();
            }
            
            
        });

    </script>
</head>
<body>
	<div class="content-box">
		<div class="form-select-box" align="center">
			<div class="layui-form layui-form-pane">
				<div class="layui-form-item">
					<div class="layui-inline layui-inline-center">
						<label class="layui-form-label">省份</label>
						<div class="layui-input-block">
							<input type="text" name="province" lay-verify="required"
								value="江苏" autocomplete="off" class="layui-input" disabled>
						</div>
					</div>
				</div>
				<div class="layui-form-item">
					<div class="layui-inline layui-inline-center">
						<label class="layui-form-label">地市</label>
						<div class="layui-input-block">
							<select name="cityId" lay-filter="cityId" id="cityId">
								<option value="">请选择</option>
								<option value="11">苏州</option>
								<option value="12">淮安</option>
								<option value="13">宿迁</option>
								<option value="14">南京</option>
								<option value="15">连云港</option>
								<option value="16">徐州</option>
								<option value="17">常州</option>
								<option value="18">镇江</option>
								<option value="19">无锡</option>
								<option value="20">南通</option>
								<option value="21">泰州</option>
								<option value="22">盐城</option>
								<option value="23">扬州</option>
								<option value="25">省级</option>
							</select>
						</div>
					</div>
				</div>
				<div class="layui-form-item">
					<div class="layui-inline layui-inline-center">
						<label class="layui-form-label">项目名称</label>
						<div class="layui-input-block">
							<input type="text" name="name" id="name" required
								lay-verify="required" placeholder="请输入项目名称" autocomplete="off"
								class="layui-input">
						</div>
					</div>
				</div>
				<div class="layui-form-item">
					<div class="layui-inline layui-inline-center">
						<label class="layui-form-label">扩展码</label>
						<div class="layui-input-block">
							<select name="extId" lay-filter="extId" id="extId">
								<option value="">请选择</option>
							</select>
						</div>
					</div>
				</div>

				<div class="layui-block" pane="">
					<button class="layui-btn layui-btn-normal" id="insert">添&nbsp;加</button>
					</button>
				</div>
			</div>
		</div>
	</div>

</body>
</html>